<template>
  <div class="Search-box">
    <p>我的学习</p>
    <ul class="Box">
      <li>
        <router-link to="/studyReg">
          <img src="./../../assets/ypt/img/1.jpg" alt="" />
        </router-link>
      </li>
      <li>
        <router-link to="/Zhineng">
          <img src="./../../assets/ypt/img/2.jpg" alt="" />
        </router-link>
      </li>
      <li>
        <router-link to="/Cuoti">
          <img src="./../../assets/ypt/img/3.jpg" alt="" />
        </router-link>
      </li>

      <!-- 
            -->
    </ul>
  </div>
</template>

<script>
export default {
  name: "Search",
  data() {
    return {};
  },
};
</script>
<style>
.Search-box {
  width: 90%;
  height: 0.8rem;
  margin: auto;
  display: flex;
  text-align: center;
  justify-content: space-between;
  align-items: center;
  line-height: 0.8rem;
  font-size: 24px;
  font-weight: 600;
}
.Search-box .Box {
  list-style: none;
  width: 1.8rem;
  height: 0.5rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding-top: 0.1.5rem;
}

.Search-box .Box li img {
  padding-top: 0.4rem;
  width: 0.4rem;
  height: 0.5rem;
  /* border: 1px solid red; */
}
</style>